<template>
  <div>
    <head1></head1>
    <!-- <div v-for="(item, i) in dict" :key="i">
        <van-row>
            <van-button span="16">{{item.name}}</van-button>
            <van-col span="8">{{ item.tcount}}</van-col>
        </van-row>
        <van-row>
            <van-col span="24">{{ item.descrip}}</van-col>
        </van-row>
    </div> -->
        <div>
            <p v-for="(i, index) in list" :key="index" align="left">
                <van-button @click="getvideo(i.id)">{{ i.name }}</van-button>
            </p>
        </div>
        <van-dialog v-model="show" title="标题" show-cancel-button>
            <video height="200px" width="350px" controls autoplay>
                <source :src="url" type="video/mp4" />
            </video>
        </van-dialog>
    <!-- </div> -->
    <footer1></footer1>
  </div>
</template>

<script>
import head1 from '../components/head1.vue'
import footer1 from '../components/footer1.vue'
export default {
    components:{
        "head1":head1,
        "footer1":footer1
    },
    data(){
        return{
            id: this.$route.query.id,
            list: [],
            dict: [],
            show: false,
            url: "",
            userid:localStorage.getItem('userid')
        }
    },
    methods:{
        getvideo(id){
            this.axios.get('/Video?id='+id+"&userid=" + this.userid +"&courseid="+this.id).then(res=>{
                if(res.data.code == 200){
                    this.url = res.data.url
                    this.show = true
                }else{
                    alert(res.data.code)
                }
            })
        },
        getdata(){
            this.axios.get("/detail?id=" + this.id).then(res=>{
                this.list = res.data.slist
                this.dict = res.data.clist
            })
        }
    },
    mounted(){
        this.getdata()
    }
}
</script>

<style>

</style>